import { defineStore } from 'pinia'
import { computed, ref } from 'vue'

// 创建仓库(命名规范:use+'仓库名'+Store)
const useTodosStore = defineStore('Todos', () => {
    // 响应式
    const todos = ref([]);

    // 计算属性
    // 计算未完成的todo数量
    const unTodoCount = computed(() => {
        return todos.value.filter((item) => !item.isDone).length;
    });

    // 方法
    // 添加
    const addTodo = (event) => {
        // event.target：获取事件发生的目标元素
        let name = event.target.value.trim();
        if (!name) {
            alert("你还没有输入任务");
            return;
        }
        let todo = { id: Date.now(), name, isDone: false };
        todos.value.unshift(todo);
        event.target.value = "";
    };

    // 删除todo
    const delTodo = (index) => {
        if (confirm("确认删除吗?")) {
            todos.value.splice(index, 1);
        }
    };

    // 全选
    let isAll = false;
    const checkAll = () => {
        isAll = !isAll;
        todos.value.forEach((item) => {
            item.isDone = isAll;
        });
    };

    // 清除已完成
    const clearTodo = () => {
        todos.value = todos.value.filter((item) => !item.isDone);
    };

    return {
        todos, unTodoCount, addTodo, delTodo, checkAll, clearTodo
    }
},
    // 存入本地存储
    {
        persist: true,
    })
export default useTodosStore;